import axios from "axios";
import React, { useEffect, useState } from "react";
import { Table, Button, Tag, notification } from "antd";
import { useNavigate } from "react-router";
// import {
//   EditOutlined,
//   DeleteOutlined,
//   ExclamationCircleOutlined,
// } from "@ant-design/icons";
export default function AuditList() {
  const navigate = useNavigate();
  const { username } = JSON.parse(localStorage.getItem("token"));
  const [dataSource, setdataSource] = useState([]);
  useEffect(() => {
    axios
      .get(
        `/news?author=${username}&auditState_ne=0&publishState_lte=1&_expand=category`
      )
      .then((res) => {
        setdataSource(res.data);
      });
  }, [username]);
  const columns = [
    {
      title: "新闻标题",
      dataIndex: "title",
      render(title, item) {
        return <a href={`#/news-manage/preview/${item.id}`}>{title}</a>;
      },
    },
    {
      title: "作者",
      dataIndex: "author",
    },

    {
      title: "新闻分类",
      dataIndex: "category",
      render(category) {
        return <div>{category.title}</div>;
      },
    },
    {
      title: "审核状态",
      dataIndex: "auditState",
      render(auditState) {
        const colorList = ["", "orange", "green", "red"];
        const auditList = ["未审核", "审核中", "已通过", "未通过"];
        return <Tag color={colorList[auditState]}>{auditList[auditState]}</Tag>;
      },
    },
    {
      title: "操作",
      render(item) {
        return (
          <div>
            {item.auditState === 1 && (
              <Button
                onClick={() => {
                  handleRevert(item);
                }}
              >
                撤销
              </Button>
            )}
            {item.auditState === 2 && (
              <Button
                danger
                onClick={() => {
                  handlePublish(item);
                }}
              >
                发布
              </Button>
            )}
            {item.auditState === 3 && (
              <Button
                type="primary"
                onClick={() => {
                  handleUpdate(item);
                }}
              >
                更新
              </Button>
            )}
          </div>
        );
      },
    },
  ];
  const handleRevert = (item) => {
    setdataSource(dataSource.filter((data) => data.id !== item.id));
    axios
      .patch(`/news/${item.id}`, {
        auditState: 0,
      })
      .then((res) => {
        navigate(`/publish-manage/published/${item.id}`);
        notification.open({
          message: "提示",
          description: `撤销成功`,
        });
      });
  };
  const handlePublish = (item) => {
    axios
      .patch(`/news/${item.id}`, {
        auditState: 2,
      })
      .then((res) => {
        notification.open({
          message: "提示",
          description: `发布成功`,
        });
      });
  };
  const handleUpdate = (item) => {
    navigate(`/news-manage/update/${item.id}`);
  };
  return (
    <div>
      <Table
        dataSource={dataSource}
        columns={columns}
        pagination="5"
        rowKey={(item) => item.id}
      />
      ;
    </div>
  );
}
